<script setup lang="ts">
import { createContext, DEFAULT_SCHEMA, type FullSchema, UIDesignerRender } from '@great/designer';
import { useRoute } from 'vue-router';
import { tryJsonParse } from '@great/utils';

const context = createContext();

const route = useRoute();
const detail = ref<any>(route.meta.initData);
const uiSchema = ref<FullSchema>(tryJsonParse(detail.value.jsonSchema, DEFAULT_SCHEMA));
</script>
<template>
    <div class="page-preview">
        <UIDesignerRender :ui-schema="uiSchema!" :context="context" v-if="detail" />
    </div>
</template>

<style scoped lang="scss">
.page-preview {
    position: relative;
    & > div {
        height: calc(100vh - 114px);
    }
}
</style>
